<template>
  <v-app text-xs-center>
    <router-view></router-view>
    <go-top></go-top>
    <div height="56px" flat v-show="$route.meta.navShow">
      <v-bottom-nav :active.sync="page" :value="true" absolute color="transparent">
        <v-layout justify-center align-center style="background:#ffffff">
          <v-flex text-xs-center>
            <router-link to="/home">
              <v-btn color="primary" flat value="home">
                <span>主页</span>
                <v-icon large dark>home</v-icon>
              </v-btn>
            </router-link>
          </v-flex>

          <v-flex text-xs-center>
            <router-link to="/user">
              <v-btn color="primary" flat value="person">
                <span>我的</span>
                <v-icon large dark>person</v-icon>
              </v-btn>
            </router-link>
          </v-flex>
        </v-layout>
      </v-bottom-nav>
    </div>
  </v-app>
</template>

<script> 
import goTop from './components/goTop'
  export default {
    name: 'App',
    data () {
      return {
        page:'home',
      }
    },
    components:{
      goTop
    }
  }
</script>

<style>
  .v-bottom-nav--absolute{
    position: fixed;
    bottom: 0
  }

  a{
    text-decoration: none
  }
</style>
